<!--
 * @Descripttion: 招商管理-意向客户跟进管理
 * @version: 
 * @Author: lehaixia
 * @Date: 2023-04-18 09:26:15
 * @LastEditors: lehaixia
 * @LastEditTime: 2023-08-14 13:45:17
-->
<template>
  <div class="has-top-pt">
    <div class="ctm-content-head-fixed">
      <SearchInput
        v-model="searchValue"
        placeholder="输入客户名称/电话/市场名称/招商经理"
        :show-action="false"
        @search="onSearch"
        @clear="onClear"
        @cancel="onSearch"
      />
    </div>

    <div class="customer-list">
      <FollowUPList ref="list" :search-value="searchValue" @stop="onStop" />
    </div>

    <Termination
      v-if="showTermination"
      v-model:show="showTermination"
      title="意向客户跟进终止"
      :detailData="rowData"
      @submit="onTermination"
    />
  </div>
</template>

<script lang="ts">
  import { reactive, toRefs, getCurrentInstance, onActivated } from 'vue'
  import { useStore } from 'vuex'
  import SearchInput from '@/components/SearchInput/index.vue'
  import FollowUPList from './components/List.vue'
  import Termination from '../potentialCustomer/components/Termination.vue'
  import { terminateItem } from '@/apis/attractInvestment/potentialCustomerFollowUp'
  import { onBeforeRouteLeave } from 'vue-router'

  export default {
    name: 'PotentialCustomerFollowUp',
    components: { SearchInput, FollowUPList, Termination },
    setup() {
      const { proxy, type }: any = getCurrentInstance()

      const $store = useStore()

      const datas = reactive({
        searchValue: '',
        showTermination: false, // 是否显示终止页
        rowData: '',
        listReLoad: false
      })

      const onSearch = () => {
        // 搜索
        proxy.$refs.list.resetPageData()
      }
      const onClear = () => {
        // 搜索
      }

      // 终止
      const onStop = (row: any) => {
        datas.showTermination = true
        datas.rowData = row
      }

      const onTermination = (data: any) => {
        const postdata: any = {
          id: data.id,
          terminateDescription: data.terminationCause
        }
        terminateItem(postdata)
          .then((res: any) => {
            if (res.success === 1) {
              proxy.$toast('终止成功')
              proxy.$refs.list.resetPageData()
            }
            datas.showTermination = false
            datas.rowData = ''
          })
          .catch((e: any) => {
            if (e) proxy.$toast(e || '终止失败')
          })
      }

      onBeforeRouteLeave((to) => {
        const instanceName = type?.name
        if (to.name === 'Index') {
          $store.commit('routerKeep/removeCache', instanceName)
        } else {
          $store.commit('routerKeep/resetCache', instanceName)
        }
      })

      proxy.$SimpleEvents.registerEvent('refreshCustomerChangeItem', () => {
        datas.listReLoad = true
      })

      onActivated(() => {
        // 缓存路由才生效
        if (datas.listReLoad) {
          proxy.$refs.list.resetPageData()
        }
        datas.listReLoad = false
      })

      return {
        ...toRefs(datas),
        onSearch,
        onClear,
        onStop,
        onTermination
      }
    }
  }
</script>
<style lang="scss" scoped></style>
